<template>
    <div>
        <!-- 幻灯片 开始 -->
        <!-- 幻灯片 结束 -->
        <div id="aCoursesList">
            <!-- 网校课程 开始 -->
            <div>
                <section class="container">
                    <header class="comm-title">
                        <h2 class="tac">
                            <span class="c-333">热门课程</span>
                        </h2>
                    </header>
                    <div>
                        <article class="comm-course-list">
                            <ul class="of" id="bna">
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442295592705.jpg"
                                                    class="img-responsive"
                                                    alt="听力口语"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="听力口语" class="course-title fsize18 c-
333">听力口语</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">9634人学习</i>
|
<i class="c-999 f-fA">9634评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442295581911.jpg"
                                                    class="img-responsive"
                                                    alt="Java精品课程"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="Java精品课程" class="course-title fsize18
c-333">Java精品课程</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">501人学习</i>
|
<i class="c-999 f-fA">501评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442295604295.jpg"
                                                    class="img-responsive"
                                                    alt="C4D零基础"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="C4D零基础" class="course-title fsize18 c-
333">C4D零基础</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">300人学习</i>
|
<i class="c-999 f-fA">300评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442302831779.jpg"
                                                    class="img-responsive"
                                                    alt="数学给宝宝带来的兴趣"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="数学给宝宝带来的兴趣" class="course-title
fsize18 c-333">数学给宝宝带来的兴趣</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">256人学习</i>
|
<i class="c-999 f-fA">256评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442295455437.jpg"
                                                    class="img-responsive"
                                                    alt="零基础入门学习Python课程学习"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a
                                                    href="#"
                                                    title="零基础入门学习Python课程学习"
                                                    class="course-title fsize18 c-333"
                                            >零基础入门学习Python课程学习</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">137人学习</i>
|
<i class="c-999 f-fA">137评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442295570359.jpg"
                                                    class="img-responsive"
                                                    alt="MySql从入门到精通"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="MySql从入门到精通" class="course-title
fsize18 c-333">MySql从入门到精通</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">125人学习</i>
|
<i class="c-999 f-fA">125评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442302852837.jpg"
                                                    class="img-responsive"
                                                    alt="搜索引擎优化技术"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="搜索引擎优化技术" class="course-title
fsize18 c-333">搜索引擎优化技术</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">123人学习</i>
|
<i class="c-999 f-fA">123评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                                <li>
                                    <div class="cc-l-wrap">
                                        <section class="course-img">
                                            <img
                                                    src="~/assets/photo/course/1442295379715.jpg"
                                                    class="img-responsive"
                                                    alt="20世纪西方音乐"
                                            >
                                            <div class="cc-mask">
                                                <a href="#" title="开始学习" class="comm-btn c-btn-1">开始
                                                    学习</a>
                                            </div>
                                        </section>
                                        <h3 class="hLh30 txtOf mt10">
                                            <a href="#" title="20世纪西方音乐" class="course-title
fsize18 c-333">20世纪西方音乐</a>
                                        </h3>
                                        <section class="mt10 hLh20 of">
<span class="fr jgTag bg-green">
<i class="c-fff fsize12 f-fA">免费</i>
</span>
                                            <span class="fl jgAttr c-ccc f-fA">
<i class="c-999 f-fA">34人学习</i>
|
<i class="c-999 f-fA">34评论</i>
</span>
                                        </section>
                                    </div>
                                </li>
                            </ul>
                            <div class="clear"></div>
                        </article>
                        <section class="tac pt20">
                            <a href="#" title="全部课程" class="comm-btn c-btn-2">全部课程</a>
                        </section>
                    </div>
                </section>
            </div>
            <!-- /网校课程 结束 -->
            <!-- 网校名师 开始 -->
            <div>
                <section class="container">
                    <header class="comm-title">
                        <h2 class="tac">
                            <span class="c-333">名师大咖</span>
                        </h2>
                    </header>
                    <div>
                        <article class="i-teacher-list">
                            <ul class="of">
                                <li>
                                    <section class="i-teach-wrap">
                                        <div class="i-teach-pic">
                                            <a href="/teacher/1" title="姚晨">
                                                <img alt="姚晨"
                                                     src="~/assets/photo/teacher/1442297885942.jpg">
                                            </a>
                                        </div>
                                        <div class="mt10 hLh30 txtOf tac">
                                            <a href="/teacher/1" title="姚晨" class="fsize18 c-666">姚
                                                晨</a>
                                        </div>
                                        <div class="hLh30 txtOf tac">
                                            <span class="fsize14 c-999">北京师范大学法学院副教授</span>
                                        </div>
                                        <div class="mt15 i-q-txt">
                                            <p
                                                    class="c-999 f-fA"
                                            >北京师范大学法学院副教授、清华大学法学博士。自2004年至今已有9年
                                                的司法考试培训经验。长期从事司法考试辅导，深知命题规律，了解解题技巧。内容把握准确，授课重
                                                点明确，层次分明，调理清晰，将法条法理与案例有机融合，强调综合，深入浅出。</p>
                                        </div>
                                    </section>
                                </li>
                                <li>
                                    <section class="i-teach-wrap">
                                        <div class="i-teach-pic">
                                            <a href="/teacher/1" title="谢娜">
                                                <img alt="谢娜"
                                                     src="~/assets/photo/teacher/1442297919077.jpg">
                                            </a>
                                        </div>
                                        <div class="mt10 hLh30 txtOf tac">
                                            <a href="/teacher/1" title="谢娜" class="fsize18 c-666">谢
                                                娜</a>
                                        </div>
                                        <div class="hLh30 txtOf tac">
                                            <span class="fsize14 c-999">资深课程设计专家，专注10年AACTP美国培训协会认证导师</span>
                                        </div>
                                        <div class="mt15 i-q-txt">
                                            <p
                                                    class="c-999 f-fA"
                                            >十年课程研发和培训咨询经验，曾任国企人力资源经理、大型外企培训经
                                                理，负责企业大学和培训体系搭建；曾任专业培训机构高级顾问、研发部总监，为包括广东移动、东莞
                                                移动、深圳移动、南方电网、工商银行、农业银行、民生银行、邮储银行、TCL集团、清华大学继续教
                                                育学院、中天路桥、广西扬翔股份等超过200家企业提供过培训与咨询服务，并担任近50个大型项目的
                                                总负责人。</p>
                                        </div>
                                    </section>
                                </li>
                                <li>
                                    <section class="i-teach-wrap">
                                        <div class="i-teach-pic">
                                            <a href="/teacher/1" title="刘德华">
                                                <img alt="刘德华"
                                                     src="~/assets/photo/teacher/1442297927029.jpg">
                                            </a>
                                        </div>
                                        <div class="mt10 hLh30 txtOf tac">
                                            <a href="/teacher/1" title="刘德华" class="fsize18 c-666">刘
                                                德华</a>
                                        </div>
                                        <div class="hLh30 txtOf tac">
                                            <span class="fsize14 c-999">上海师范大学法学院副教授</span>
                                        </div>
                                        <div class="mt15 i-q-txt">
                                            <p
                                                    class="c-999 f-fA"
                                            >上海师范大学法学院副教授、清华大学法学博士。自2004年至今已有9年
                                                的司法考试培训经验。长期从事司法考试辅导，深知命题规律，了解解题技巧。内容把握准确，授课重
                                                点明确，层次分明，调理清晰，将法条法理与案例有机融合，强调综合，深入浅出。</p>
                                        </div>
                                    </section>
                                </li>
                                <li>
                                    <section class="i-teach-wrap">
                                        <div class="i-teach-pic">
                                            <a href="/teacher/1" title="周润发">
                                                <img alt="周润发"
                                                     src="~/assets/photo/teacher/1442297935589.jpg">
                                            </a>
                                        </div>
                                        <div class="mt10 hLh30 txtOf tac">
                                            <a href="/teacher/1" title="周润发" class="fsize18 c-666">周
                                                润发</a>
                                        </div>
                                        <div class="hLh30 txtOf tac">
<span class="fsize14 c-999">考研政治辅导实战派专家，全国考研政
治命题研究组核心成员。</span>
                                        </div>
                                        <div class="mt15 i-q-txt">
                                            <p
                                                    class="c-999 f-fA"
                                            >法学博士，北京师范大学马克思主义学院副教授，专攻毛泽东思想概论、
                                                邓小平理论，长期从事考研辅导。出版著作两部，发表学术论文30余篇，主持国家社会科学基金项目和
                                                教育部重大课题子课题各一项，参与中央实施马克思主义理论研究和建设工程项目。</p>
                                        </div>
                                    </section>
                                    /li>
                            </ul>
                            <div class="clear"></div>
                        </article>
                        <section class="tac pt20">
                            <a href="#" title="全部讲师" class="comm-btn c-btn-2">全部讲师</a>
                        </section>
                    </div>
                </section>
            </div>
            <!-- /网校名师 结束 -->
        </div>
    </div>
</template>
<script>
    export default {}
</script>